<script>
import find from 'lodash-es/find.js';
export default {
  name: 'map-building',
  render() {
    return null;
  },
  props: {
    mapGetter: { type: Function, default: undefined },
  },
  created() {
    this.map = this.mapGetter();
    this.showBuildings();
    this.$vbus.$on('toggleMapBuilding', (visible) => {
      visible ? this.buildingLayer.show() : this.buildingLayer.hide();
    });
  },
  unmounted() {
    this.$vbus.$off('toggleMapBuilding');
  },
  beforeDestroy() {
    this.$vbus.$off('toggleMapBuilding');
  },
  methods: {
    showBuildings() {
      if (!this.map) return;
      this.buildingLayer = find(this.map.getLayers(), (item) => item.CLASS_NAME === 'AMap.Buildings');
    },
  },
};
</script>

<style scoped></style>
